<style scoped>
	.Interested{
		padding-left: 30px;
		padding-right: 30px;
		padding-top: 25px;
		padding-bottom: 15px;
	}
	.big_description_span{
		width: 3px;
		height: 18px;
		background: #2D8CF0;
		display: inline-block;
		position: relative;
		top: 4px;
		margin-right: 5px;
	}
	.big_description_span1{
		font-size: 15px;
		font-weight: 700;
	}
	.Interested_head{
		margin-top: 25px;
	}
	.demo-carousel{
		height: 470px;
	}
	.demo_div{
		border-bottom: 1px dashed;
		height: 85px;
		padding-left: 10px;
	}
	.demo_ul{
		list-style: none;
		font-size: 14px;
		/*text-align: center;*/
		display: inline-block;
		width: 100%;
		line-height: 48px;
	}
	.demo_ul li{
		float: left;
		height: 30px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	.demo_li1{
		color: #2E6CF0;
		font-size: 16px;
	}
	.demo_li1:hover{
		text-decoration: underline;
		font-size: 16px;
		cursor: pointer;
	}
	.demo_li2{
		color: #2E6CF0;
		font-size: 16px;
	}
	.demo_li3:hover{
		text-decoration: underline;
	}
	#Interested_Carousel>.ivu-carousel-arrow.left{
		left: -25px;
	}
	#Interested_Carousel>.ivu-carousel-arrow.right{
		right: -25px;
	}
</style>
<template>
    <div class="Interested">
      	<div class="Interested_head">
    		<span class="big_description_span"></span>
    		<span class="big_description_span1">可能感兴趣的职位 : </span>
    	</div>
    	<Carousel autoplay v-model="value2" id="Interested_Carousel">
	        <CarouselItem v-for="(item, index) in posList"  @on-change="changeTime(index)">
	            <div class="demo-carousel">
	            	<div class="demo_div" v-for="(item, index) in posList">
	            		<ul class="demo_ul">
	            			<li class="demo_li1" style="width: 40%;">{{item.pos}}</li>
	            			<li class="demo_li2" style="width: 20%;">{{item.face}}</li>
	            			<li style="width: 40%;">{{item.company}}</li>
	            			<li class="demo_li3" style="width: 40%;">{{item.education}} | {{item.years}}年</li>
	            			<li style="width: 20%;">{{item.adress}}</li>
	            			<li style="width: 40%;">{{item.industy}}</li>
	            		</ul>
	            	</div>
	            </div>
	        </CarouselItem>
        </Carousel>
    </div>
</template>
<script>
	export default {
    	name: 'Interested',
        data () {
            return {
            	value2: 0,
            	posList:[
            	    {pos:"Web前端工程师",face:"面议",company:"深圳北斗卫星信息科技集团",education:"不限",years:"5",adress:"深圳光明",industy:"计算机软件"},
            	    {pos:"Web前端工程师",face:"面议",company:"深圳北斗卫星信息科技集团",education:"不限",years:"5",adress:"深圳光明",industy:"计算机软件"},
            	    {pos:"Web前端工程师",face:"面议",company:"深圳北斗卫星信息科技集团",education:"不限",years:"5",adress:"深圳光明",industy:"计算机软件"},
            	    {pos:"Web前端工程师",face:"面议",company:"深圳北斗卫星信息科技集团",education:"不限",years:"5",adress:"深圳光明",industy:"计算机软件"},
            	    {pos:"Web前端工程师",face:"面议",company:"深圳北斗卫星信息科技集团",education:"不限",years:"5",adress:"深圳光明",industy:"计算机软件"},
            	]
            }
        },
        methods:{
        	changeTime(num){
		        alert(num)
		    }
        },
        mounted () {
		}
    }
</script>